<script lang="ts" setup>
import { onMounted } from 'vue';
import { useExhibitionOrderListStore } from '../../store/exhibitionOrder/exhibitionOrder';
import { useRoute } from 'vue-router'
import utils from '../../utils/utils';
import exhibition from '../../api/exhibition';
const exhibitionOrderStore = useExhibitionOrderListStore()
const route = useRoute()
function initExhiOrder() {
    // 如果路由中有展览ID，则获取该展览信息
    const exhibitionId = route.params.id
    console.log('exhibitionId:', exhibitionId)
    exhibition.getExhibitionOrderById(exhibitionId).then(res => {
        console.log(res.data.data)
        exhibitionOrderStore.exhiOrder = res.data.data
    }).catch(err => {
        console.log(err)
    })
}
onMounted(() => {
    initExhiOrder()
})
</script>
<template>
    <el-table :data="exhibitionOrderStore.exhiOrder" height="250" style="width: 100%">
        <el-table-column prop="id" label="订单编号" width="100" align="center" header-align="center" />
        <el-table-column prop="name" label="展览名称" width="200" align="center" header-align="center" />
        <el-table-column prop="exhiDate" label="展览时间" align="center" header-align="center" />
        <el-table-column prop="username" label="姓名" align="center" header-align="center" />
        <el-table-column prop="identity" label="证件码" align="center" header-align="center" />
        <el-table-column prop="ticketName" label="凭证类型" align="center" header-align="center" />
        <el-table-column prop="ticketCost" label="支付金额" align="center" header-align="center">
            <template #default="scope">
                {{ scope.row.ticketCost }}￥
            </template>
        </el-table-column>
        <el-table-column prop="createTime" label="下单时间" align="center" header-align="center">
            <template #default="scope">
                {{ utils.formatDate(scope.row.createTime) }}
            </template>
        </el-table-column>
    </el-table>
</template>
<style scoped></style>